“froyo Grid Responsive Blogger Template” Documentation
Created: 02/02/2015
By: Seobloggertemplates
Email: seobloggertemplates@gmail.com
Thank you for purchasing my theme. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!
Table of Contents
- InstallationVERY IMPORTANT
- Add Social Links
- Setting up the menu
- Add header Advertisement
- Add facebook like box
- Add custom 404 page for SEO
- Installation - top
- Add Big Header Banner Ad - top
- How To Change Menu Item- top
- Add post slider - top
- Add Facebook like box- top
- if search widget won't work - top
- Latest Comment Widget- top
- Add social links in footer- top
Now you have This Blogger Template. You Can Follow This Steps To Upload Your Blogger Template To Blogger Platform. First Login to your Blogger DashBoard by Using Your Google Username And Password from Here.
Then follow these steps:
1. On Blogger Dashboard Click Template.
2. Click Backup/Restore button (Top Right).
3. Click Choose ( Browse..) File button. Find where the “xml” file location.
4. Then Click Upload.
Note: Before Uploading This Template Mobile Blogger Template Must Enable to make Blogger Customize Work
1. On Blogger Dashbord Click Layout
2. Click Edit Add Widget and Choose html/javascript widget
3. Add your advertisement code in that widget :
Try to Find this Code in your template file
<nav id='navigation'> after that you'll find Some code like this:
<ul class='nav custom-nav sf-js-enabled' id='main-nav'><li><a href='#'>Home</a></li>
<li><a class='sf-with-ul' href='#'>Dropdown<span class='sf-sub-indicator'> »</span></a>
<ul class='sub-menu'>
<li><a href='#'>Link1</a></li>
<li><a href='#'>Link2</a></li>
<li><a href='#'>Contact Form</a></li>
<li><a href='#'>Some Label</a></li>
<li><a href='#'>Label2</a></li>
<li><a href='#'>Link4</a></li>
</ul>
</li>
<li><a class='sf-with-ul' href='#'>Categories<span class='sf-sub-indicator'> »</span></a>
<ul class='sub-menu'>
<li><a href='#'>Link1</a></li>
<li><a href='#'>Link2</a></li>
<li><a href='#'>Contact Form</a></li>
<li><a href='#'>Some Label</a></li>
<li><a href='#'>Label2</a></li>
<li><a href='#'>Link4</a></li>
</ul>
</li>
<li><a class='sf-with-ul' href='http:'#'>Features<span class='sf-sub-indicator'> »</span></a>
<ul class='sub-menu'>
<li><a href='#'>Alternative Homepage</a></li>
<li><a href='#'>Archive Example</a></li>
<li><a href='#'>Author Page</a></li>
<li><a href='#'>Error 404</a></li>
<li><a href='#'>Full Width</a></li>
<li><a href='#'>Redirect</a></li>
</ul>
</li>
<li><a href='#'>Blog</a></li>
<li><a href='#'><i class='icon-download-alt'/> Purchase</a></li>
</ul>
</nav>
Change It according to your need
1. On Blogger Dashbord Click Layout
2. Click Edit
3. Add the following code in that widget
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function () {
CameraSlider({
blogURL:'enter your blog url here',
idcontaint:"#randompost",
NumCharacter: 160,
mobileEasing: '',
pauseOnClick: false,
});
});
//]]>
</script>
You must provide your blog url otherwise it won't work
You must wrap your facebook iframe code in this <div id="likebox-wrapper"> otherwise it won't be responsive
this is incase if search is won't display or won't work, juts go to layout and add html/javascript in appropriate section and add the folowing code in the widget
<div class="search-bar"> <div class="nav-search"> <form action="/search" class="searchform" method="get" role="search"> <input class="search_input" id="s" name="q" onblur="if(this.value=='')this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value=''" type="text" value="Search and hit" /> <input type="submit" class="searchSubmit" value="" /> </form> </div></div>
go to add and add the following code in the the widget at appropriate section
<script type="text/javascript"> //<![CDATA[ // Recent Comments Settings var numComments = 3, showAvatar = true, avatarSize = 60, roundAvatar = true, characters = 40, showMorelink = false, moreLinktext = "More »", defaultAvatar = "https://dl.dropboxusercontent.com/u/96066855/DreamMag/icons/avatar.png", hideCredits = true; //]]> </script> <script type="text/javascript" src="http://yourjavascript.com/47196111115/shooncmnt.js"></script> <script type="text/javascript" src="http://yourblogurl///feeds/comments/default?alt=json&callback=shooncomments&max-results=5"></script>
just add your blog url in place of yourblogurl
go to add and add the following code in the the widget at appropriate section
<ul class="social-menu"> <li class="sprite-rss"><a title="Rss Feed" href="#" class="">Rss Feed</a></li> <li class="sprite-google"><a title="Google+" href="#">Google+</a></li> <li class="sprite-behance"><a title="Behance" href="#">Behance</a></li> <li class="sprite-lastfm"><a title="Last FM" href="#">Last FM</a></li> <li class="sprite-linkedin"><a title="LinkedIn" href="#">Linked In</a></li> <li class="sprite-flickr"><a title="Flickr" href="#">Flickr</a></li> <li class="sprite-deviantart"><a title="Deviant Art" href="#">Deviant Art</a></li> <li class="sprite-tumblr"><a title="Tumblr" href="#">Tumblr</a></li> <li class="sprite-vimeo"><a title="Vimeo" href="#">Vimeo</a></li> <li class="sprite-youtube"><a title="You Tube" href="#">You Tube</a></li> <li class="sprite-twitter"><a title="Twitter" href="#">Twitter</a></li> <li class="sprite-facebook"><a title="Facebook" href="#">Facebook</a></li> </ul>
just delete the link which you don't want to use and replace the links
Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. If you have a more general question related to the themes on Bthemez, COntact me via email..